<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<script type="text/javascript" src="../../zxt/zxt.js"></script>
  <script>
    	importZXT("../../zxt");
  </script>
	
</head>

<body class="bodyBackground">

	<div style="height:600px"></div>

	<div id="s1" zxt="zxt.ui.Select" style="width: 150px;" zxt.required="true" zxt.conf="Format:'$VALUE$ $LABEL$', Intelligent:false" zxt.maxHeight="100px" zxt.formatType="A(4)">
		<div zxt.option="" zxt.label="" ></div>
		<div zxt.option="1001" zxt.label="灵活分期美元-100001"></div>
		<div zxt.option="1002" zxt.label="灵活分期美元-100002"></div>
		<div zxt.option="1003" zxt.label="灵活分期美元-100003"></div>
		<div zxt.option="1004" zxt.label="灵活分期美元-100004"></div>
		<div zxt.option="1005" zxt.label="灵活分期美元-100005"></div>
		<div zxt.option="1006" zxt.label="灵活分期美元-100006"></div>
	</div>
	<table cellpadding=0 cellspacing=0 style="width:1000px">
		<tr>
			<td width="70%">
				<div id="s2" zxt="zxt.ui.Select" zxt.maxHeight="100px" zxt.value="1" style="" zxt.labelonly="false" zxt.conf="Format:'$LABEL$ -- {$VALUE$}'" style="width:100%">
  				<div zxt.option="" zxt.label="" ></div>  				
  				<div zxt.option="1" zxt.label="男"></div>
  				<div zxt.option="2" zxt.label="女"></div>
  				<div zxt.option="3" zxt.label="男"></div>
  				<div zxt.option="4" zxt.label="女"></div>
  				<div zxt.option="5" zxt.label="男"></div>
  				<div zxt.option="6" zxt.label="女"></div>
  				<div zxt.option="7" zxt.label="男"></div>
  				<div zxt.option="8" zxt.label="女"></div>
  				<div zxt.option="9" zxt.label="女"></div>
  				<div zxt.option="10" zxt.label="男"></div>
  			</div>
			</td>
			<td width="30%">
				<input type="button" class='por-Button' onclick="javascript:setRequired();" value="SET REQUIRED"/>
			</td>
		</tr>
	</table>	
	<table>
		<tr>
			<td width="20%">getType()</td>
			<td width="50%">返回控件类型</td>
			<td><input type="button" name="getType" value="getType" 
				onclick="alert('第一个下拉框控件的type为'+$zxtUI.s1.getType());"/></td>
		</tr>
		<tr>
			<td>beforeGetValue() </td>
			<td>获取选中项的值 内部调用函数</td>
			<td></td>
		</tr>
		<tr>
			<td>renderValue() </td>
			<td>渲染值</td>
			<td><input type="button" name="renderValue" value="renderValue" 
				onclick="$zxtUI.s2.renderValue('10')"/></td>
		</tr>
		<tr>
			<td>getValue() </td>
			<td>获取值</td>
			<td><input type="button" name="getValue" value="getValue" 
				onclick="alert($zxtUI.s2.getValue())"/></td>
		</tr>
		<tr>
			<td>choose() </td>
			<td>显示选中的下拉列表某项内容 内部调用函数</td>
			<td></td>
		</tr>
		<tr>
			<td>focus() </td>
			<td>设置当前控件焦点</td>
			<td><input type="button" name="focus" value="focus" 
				onclick="$zxtUI.s2.focus();alert('第二个下拉框控件获得焦点');"/></td>
		</tr>
		<tr>
			<td>show()</td>
			<td>打开下拉框筛选内容</td>
			<td><input type="button" name="show" value="show" 
				onclick="$zxtUI.s2.show();"/></td>
		</tr>
	</table>

	<div><a href="../index.html">返回</a></div>
</body>
</html>



<script>  
	
	$zxt.init();	
	$zxtUI.s2.mode("MASK");
	$zxtUI.s2.render();
	$zxtUI.s1.renderValue("1002");
	function setRequired(){
		$zxtUI.s2.conf({Required:true});
		$zxtUI.s2.render();
	};

</script>


